<script type="text/javascript">
var juara_edit;
var juara_delete;
$(document).ready(function(){
/* Start Variable Declaration */
    var juara_source;
    var juara_adapter;
    var juara_buttonAdd;
    var juara_searchField;
    var juara_grid=$('#juara_grid');
    
/* Grid And Toolbar Declaration */
    juara_source={
        url : 'index.php/c_juara/get_list',
        datatype : 'json',
        root : 'results',
		data : {search_text : ''},
        datafields : [
            { name : 'juara_id' },
            { name : 'juara_nama' },
            { name : 'juara_aktif', type : 'boolean' }
        ],
        beforeprocessing : function(data){
            juara_source.totalrecords = data[0].total;
        },
		addrow: function (rowid, rowdata, position, commit) {
			commit(true);
		},
		updaterow: function (rowid, rowdata, commit) {
			var params=JSON.stringify(rowdata);
			$.ajax({
				url : 'c_juara/save',
				method : 'post',
				data : {params:params},
				success : function(response){
					var res = $.parseJSON(response);
					juara_grid.jqxGrid('updatebounddata');
					$.global_show_notif(MSAVE_SUCCESS,'success');
				}
			});
			commit(true);
		}
    }
    juara_adapter = new $.jqx.dataAdapter(juara_source);
    
	juara_buttonAdd = $("<button style='margin-left: 5px;'><img src='assets/images/icons/add.png'> Tambah Data</button>");
    juara_buttonAdd.jqxButton({ width : 120 });
    juara_buttonAdd.bind('click', juara_btnAdd_click);
    juara_searchField = $('<input type="text" class="inputfield" name="juara_search" placeholder="Pencarian">');
    juara_searchField.jqxInput({ theme : global_theme });
	
    juara_grid.jqxGrid({
        source : juara_adapter,
        width : '100%',
        theme : global_theme,
        pagesize : 15,
        pagesizeoptions : [15],
        sortable : true,
		pageable: true,
        filterable : true,
        columnsresize : true,
        autoheight : true,
        virtualmode : true,
        showtoolbar: true,
		editable: true,
		selectionmode: 'singlerow',
		editmode: 'selectedrow',
        rendertoolbar: function (toolbar) {
            var me = this;
            var container = $("<div style='margin: 5px;'></div>");
            container.append(juara_buttonAdd);
            container.append(' | ');
            container.append(juara_searchField);
            toolbar.append(container);
        },
        rendergridrows : function(){
            return juara_adapter.records;
        },
        columns : [
            { text : 'Id', dataField : 'juara_id', hidden : true, columntype: 'textbox' },
            { text : 'Nama', dataField : 'juara_nama', columntype: 'textbox', validation : fpublic_emptyValidation },
            { text : 'Aktif', dataField : 'juara_aktif', columntype: 'checkbox', width : 50 },
			{ text : '&nbsp;', width: 30, editable: false, cellsrenderer : function(row){
					return '<img src="assets/images/icons/edit.png" onClick="juara_edit(event, ' + row + ')" title="Ubah Data" style="margin:2px 7px 2px 7px;"/>';
				}
			},
			{ text : '&nbsp;', width: 30, editable: false, cellsrenderer : function(row){
					var record = juara_grid.jqxGrid('getrowdata', row);
					var id = record.juara_id;
					return '<img src="assets/images/icons/delete.png" id="juaradelbtn_' + id + '" onClick="juara_delete(event, ' + id + ')" title="Hapus Data" style="margin:2px 7px 2px 7px;"/>';
				}
			}
        ]
    });
/* Function Declaration */
	function juara_btnAdd_click(){
		var rowid = juara_grid.jqxGrid('getdatainformation').rowscount + 1;
		var row = {};
		row['juara_id']=0;
		row['juara_nama']='';
		row['juara_aktif']=1;
		var commit = juara_grid.jqxGrid('addrow',rowid, row, 'top');
		juara_grid.jqxGrid('selectrow', 0);
		juara_grid.jqxGrid('beginrowedit', 0);
		$('#textboxeditorjuara_gridjuara_nama').focus();
	}
	juara_edit = function(e, row_index){
		juara_grid.jqxGrid('beginrowedit', row_index);
		$("#textboxeditorjuara_gridjuara_nama").focus();
	}
	juara_delete = function(e, juara_id){
		$.global_show_confirm('Peringatan',MCONFIRM_DELETE_MASTER);
		$("#confirm_window_ok").unbind('click').click(function(){
			var process = $.global_show_processing();
			$.ajax({
				url : 'c_juara/delete',
				method : 'post',
				data : {juara_id:juara_id},
				success : function(response){
					process.hide();
					var res = $.parseJSON(response);
					juara_grid.jqxGrid('updatebounddata');
					$.global_show_notif(MSAVE_SUCCESS,'success');
				}
			});
			return false;
		});
	}
	juara_searchField.on('keydown', function(e){
		if(e.keyCode == 13){
			juara_source['data']['search_text'] = $(this).val();
			juara_grid.jqxGrid('gotopage',0);
			juara_grid.jqxGrid('updatebounddata');
		}
	});
});
</script>
<div>
    <div id="juara_grid"></div>
</div>